<template>
  <van-popover
    placement="top-start"
    :actions="[
      { text: '查看处方', disabled: !order.prescriptionId },
      { text: '删除订单' },
    ]"
    @select="onSelect"
  >
    <template #reference>
      <span class="more" @click="onMore(order.id,order.prescriptionId)"
        >更多</span
      >
    </template>
  </van-popover>
  <van-button class="out" round plain>问诊记录</van-button>
  <slot></slot>
</template>

<script setup>
import { defineProps, defineEmits, ref } from 'vue'
import { referPrescription } from '@/api'
import { showImagePreview } from 'vant'

defineProps({
  order: {
    type: Object,
    default: () => {}
  }
})
const emits = defineEmits(['onDelOrder', 'onSelect'])

// 点击更多
const currentId = ref('')
const currentPrescriptionId = ref('')
const onMore = (id, prescriptionId) => {
  currentId.value = id
  currentPrescriptionId.value = prescriptionId
}
const onSelect = async (action) => {
  if (action.text === '查看处方') {
    // console.log('查看处方')
    const { data } = await referPrescription(currentPrescriptionId.value)
    showImagePreview([data.url])
  } else {
    // console.log('删除订单')
    emits('onDelOrder', currentId.value)
  }
}
</script>

<style lang="scss" scoped></style>
